<%--
  Created by IntelliJ IDEA.
  User: 12244
  Date: 2020/8/29
  Time: 12:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>登入页面</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
  </head>
  <body style="padding-left: 30%;">
  <%
    Cookie[] cookies = request.getCookies();
    if(cookies != null){
    for (Cookie c:cookies) {
      if ("certificate".equals(c.getName()) && "loginSuccess".equals(c.getValue())) {
        request.setAttribute(c.getName(), c.getValue());
        System.out.println(c.getName() + " " + c.getValue());
        request.getRequestDispatcher("login").forward(request, response);
      }
    }
    }
  %>
  <%--form表单，方式为post，onsubmit里为校验方法 ，样式采用bootstrap样式 --%>
          <form class="form-horizontal" action="login" method="post" onsubmit="return check()">
            <div class="form-group">
              <label for="uname" class="col-sm-2 control-label">账号</label>
              <div class="col-sm-10" style="width: 20%">
                <input type="text" class="form-control" id="uname" placeholder="Username" name="username">
              </div>
            </div>
            <%--当登入失败的话，servlet会返回下面这个信息，当一个标签里有值时，表示登入失败，和js搭配--%>
            <label hidden id="ee"><%=request.getAttribute("err")%></label>
            <div class="form-group">
              <label for="psw" class="col-sm-2 control-label">密码</label>
              <div class="col-sm-10" style="width: 20%">
                <input type="password" class="form-control" id="psw" placeholder="Password" name="password">
              </div>
            </div>
            <div class="form-group">
              <div class="col-sm-offset-2 col-sm-10">
                <button type="submit" class="btn btn-default">登入</button>
              </div>
            </div>
          </form>
  </body>
  <script src="./js/jquery-3.3.1.min.js"></script>
  <script src="./js/bootstrap.min.js"></script>
  <script>
    //校验方法
      function check(){
        var name = $("#uname").val();
        var psw = $("#psw").val();
        if(name==null || name.trim()==""){
            alert("用户名不能为空!");
            return false;
        }else if(psw == null || psw.trim()==""){
          alert("密码不能为空!");
          return false;
        }
        return true;
      }
      //登入失败弹框提醒
      $(function(){
        var value = $("#ee").html();
        if(value != "null"){
          alert(value);
        }
      });
  </script>
</html>
